<template>
  <div class="page">
    <el-button type="primary">新增</el-button>
    <el-table
      :data="list"
      style="width: 100%;margin-top: 24px;">
      <el-table-column
        type="index"
        label="序号"
        width="50">
      </el-table-column>
      <el-table-column
        prop="name"
        label="名称"
        width="140">
      </el-table-column>
      <el-table-column
        prop="iconPath"
        label="图标"
        width="180">
      </el-table-column>
      <el-table-column
        prop="route"
        label="路由"
        min-width="200">
      </el-table-column>
      <el-table-column
        prop="route"
        label="跳转类型"
        width="100">
        <template slot-scope="{row}">
          {{ pageTypes[row.pageType] }}
        </template>
      </el-table-column>
      <el-table-column
        prop="type"
        label="菜单类型"
        width="100">
        <template slot-scope="{row}">
          {{ types[row.type] }}
        </template>
      </el-table-column>
      <el-table-column
        prop="level"
        label="二级菜单"
        width="100">
      </el-table-column>
      <el-table-column
        prop="route"
        label="状态"
        width="100">
        <template slot-scope="{row}">
          {{ row.status ? '启用' : '禁用' }}
        </template>
      </el-table-column>
      <el-table-column
        prop="route"
        label="操作"
        width="100">
        <template slot-scope="{row}">
          <el-button type="text">删除</el-button>
        </template>
      </el-table-column>
      
    </el-table>
  </div>
</template>

<script>
import {getMenu} from '@/api/menus'
const pageTypes = {
  1: '页面',
  2: '外链',
  3: '自助缴费',
  4: '小程序', 
  5: '打开链接'
}
 const types = {
  1: '预约挂号',
  2: '门诊缴费',
  3: '报告查询',
  4: '住院服务',
  5: '综合服务',
  6: '页面最底部',
  7: '个人中心',
  8: '自助缴费'
}

export default {
  name: 'Manage40Index',

  data() {
    return {
      pageTypes,
      types,
      list: []
    };
  },

  mounted() {
    // this.getMenu()
  },

  methods: {
    getMenu() {
      const data = {
        pageIndex: 1,
        pageSize: 99
      }
      getMenu(data).then(res => {
        console.log(res)
        this.list = res.records
      })
    }
  },
};
</script>

<style scoped>
.page {
  padding: 24px;
}
</style>